/**
 * Created by JetBrains WebStorm.
 * User: Silence
 * Date: 3/25/12
 * Time: 2:25 PM
 * To change this template use File | Settings | File Templates.
 */

Ext.require([
    'Ext.data.*',
    'Ext.grid.*',
    'Ext.tree.*'
]);

Ext.override(Ext.data.AbstractStore,{
    indexOf: Ext.emptyFn
});

Ext.define('EM.view.event.BudgetTreePanel', {
    extend: 'Ext.tree.Panel',
    alias: 'widget.budgettreepanel',
    title: 'Budget Report',
    collapsible: true,
    useArrows: true,
    rootVisible: false,
    multiSelect: true,
    store: 'BudgetTreeStore',
    viewConfig: {
        plugins: {
            ptype: 'treeviewdragdrop'
        },
        listeners: {
            drop: function(node, data, overModel, dropPosition, eOpts) {
                /*for (var i = 0; i < data.records.length; i++) {
                    alert(data.records[i].get('pid') + ' ' + overModel.get('id'));
                }*/
                if (overModel.get('leaf')) {
                    for (var i = 0; i < data.records.length; i++) {
                        data.records[i].set('pid', overModel.get('pid'));
                    }
                }
                else {
                    for (var i = 0; i < data.records.length; i++) {
                        data.records[i].set('pid', overModel.get('id'));
                    }
                }
                Ext.getCmp('budgettreepanel').getStore().sync();
            }
        },
        toggleOnDblClick:false
    },
    plugins: [
        Ext.create('Ext.grid.plugin.CellEditing', {
            clicksToEdit: 2,
            listeners: {
                edit: function(editor, e) {
                    var temp = Ext.getCmp('budgettreepanel').getStore().getNodeById(e.record.get('id'));
                    if (e.field == 'cost' || e.field == 'budget') {
                        if (temp.get('pid') != 0) {
                            var deltaValue = e.value - e.originalValue;
                            do {
                                temp = Ext.getCmp('budgettreepanel').getStore().getNodeById(temp.get('pid'));
                                temp.set(e.field, temp.get(e.field) + deltaValue);
                            } while  (temp.get('pid') != 0);
                        }
                    }
                    else {
                    }
                    Ext.getCmp('budgettreepanel').getStore().sync();
                },
                beforeedit: function(e, editor){
                    if (e.record.get('leaf') || (e.field != 'cost' && e.field != 'budget')) {
                        return true;
                    }
                    else return false;
                }
            }
        })
    ],
    tbar: [
        {
            text: 'Collapse All',
            handler: function() {
                Ext.getCmp('budgettreepanel').collapseAll();
            }
        },'-',
        {
            text: 'Expand All',
            handler: function() {
                Ext.getCmp('budgettreepanel').expandAll();
            }
        }
    ],
    columns: [
        {
            xtype: 'treecolumn', //this is so we know which column will show the tree
            text: 'Item',
            flex: 2,
            sortable: true,
            dataIndex: 'item',
            editor: {xtype: 'textfield', allowBlank: false}
        },
        {
            //we must use the templateheader component so we can use a custom tpl
            xtype: 'templatecolumn',
            text: 'Actual Cost',
            flex: 1,
            sortable: true,
            dataIndex: 'cost',
            align: 'center',
            editor: {xtype: 'textfield', allowBlank: false},
            //add in the custom tpl for the rows
            tpl: Ext.create('Ext.XTemplate', '{cost:this.formatHours}', {
                formatHours: function (v) {
                    return  (v < 0? '-': '') + '$' + Number(v < 0? -v: v).toFixed(2);
                }
            })
        },
        {
            text: 'Max Reducible',
            xtype: 'templatecolumn',
            flex: 1,
            dataIndex: 'maxR',
            sortable: true,
            tpl: Ext.create('Ext.XTemplate', '{maxR:this.formatHours}', {
                formatHours: function (v) {
                    return  (v < 0? '-': '') + '$' + Number(v < 0? -v: v).toFixed(2);
                }
            })
        },
        {
            text: 'Budget',
            xtype: 'templatecolumn',
            flex: 1,
            dataIndex: 'budget',
            sortable: true,
            editor: {xtype: 'textfield', allowBlank: false},
            tpl: Ext.create('Ext.XTemplate', '{budget:this.formatHours}', {
                formatHours: function (v) {
                    return  (v < 0? '-': '') + '$' + Number(v < 0? -v: v).toFixed(2);
                }
            })
        },
        {
            text: 'Variance',
            xtype: 'templatecolumn',
            flex: 1,
            sortable: true,
            dataIndex: 'variance',
            tpl: Ext.create('Ext.XTemplate',
                '{[values.budget-values.cost < 0 ? "-" : ""]}${[Number(values.budget - values.cost < 0? values.cost - values.budget : values.budget - values.cost).toFixed(2)]}'
            )
        }
    ]
});